<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>轮播图</title>
    <link rel="stylesheet" href="./carousel.css">
</head>
<body>
<!--carousel 为最外层的展示窗口的块-->
 <div class="carousel">
     <!--slide 为一个长块-->
     <div class="slide">
         <!--为最里面存放图片的块-->
         <div class="slide-item">
             <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/397f2569b126d8fba446b6bbf57ef771.jpg?w=2452&h=920">
         </div>
         <div class="slide-item">
             <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/048ce6037b94d030d964b70b9b52a3f0.jpg?thumb=1&w=1533&h=575&f=webp&q=90">
         </div>
         <div class="slide-item">
             <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/26784c0f74a95bdb8e41b7d91a10b83f.jpg?thumb=1&w=1533&h=575&f=webp&q=90">
         </div>
     </div>
 </div>
<script src="carousel.js"></script>
</body>
</html>